﻿@{
    ViewData["Module"] = "Node";
    ViewData["curr"] = "menu";
}
@Html.IncludePage("CoralAdmin/node", "_Left")
<!--content-->
<div id="pbody">
    <div class="extra ">
        <div class="pbody_top">
            <span class="ico ico_setting_system"></span><span class="t t_c">内容管理&nbsp;&nbsp;/&nbsp;&nbsp;<b
                class=" t_small f_no">菜单视图</b></span>
        </div>
        <div id="main">
            <div class="line_solid clearfix">
                <div class="content_slide">
                    <div class="select_owner w_10-5 " data-meta="{value:'@Request.QueryString["groupSlug"]',fun:'selectFun', btn:'<span class=\'ico ico_slide_down\'></span>' , clickbtn:'<span class=\'ico ico_slide_up\'></span>'}">
                        <ul>
                            @foreach (var item in ViewBag.MenuGroup) {
                                <li data-value="@item.Slug">@item.Title</li>
                            }
                        </ul>
                    </div>
                    <div class="nav_left">
                        <div class="border-top1 pb_1"></div>
                        <ul id="menuTree"></ul>
                    </div>
                </div>
                <div class="ml_12">
                    <div class="content_tab extra_normal">
                        <div class="tablist extra_normal" data-js="tab">
                            <a href="#">预览</a>
                            <a href="#">编辑</a>
                        </div>
                    </div>
                </div>
                <style>
                    #showcontainer { min-height: 400px; }
                    #showIframe { border: none; display: inline-block; width: 100%; height: 100%; }
                </style>
                <div class="js_tabcnt ml_12">
                    <div id="showcontainer">
                        <iframe src="" id="showIframe"></iframe>
                    </div>
                    <div class="js_ajaxLoad ">
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<div id="overlay" class="clearfix overlay w_90">
    <div class="js-overlay-node"></div>
</div>
<textarea style="display: none;" id="menu_tree">@ViewBag.MenuTreeData</textarea>
<script type="text/javascript">
    function selectFun(obj) {
        location.href = "/m/menu/menuNode?groupSlug=" + $(obj).find('input:hidden').val();
    }



    function ajaxLoad(obj, callback) {
        $.ajax({
            url: $(obj).attr("href"),
            beforeSend: function () {
                $('.loading').show();
            },
            success: function (data) {
                $('.js_ajaxLoad').html(data);
                $('.loading').hide();
                if (callback != undefined) {
                    callback();
                }
                else {
                    $(".tablist a").eq(0).trigger("click");
                }


            }
        });
    }

    function ajaxShowPath(id) {
        $.post("/m/menu/GetMenuPath/" + id, function (data) {
            $("#showIframe").attr("src", data.Path);
            $('.loading').hide();

        })
    }
    $(document).ready(function () {
        resiezeShowContainer();
        window.onresize = function () {
            resiezeShowContainer();
        }


        function resiezeShowContainer() {
            $("#showcontainer").height($(window).height() - 170);
        }


        $('.j_ajax_load').live("click", function (e) {
            e.preventDefault();
            ajaxLoad($(this), function () {
                $(".tablist a").eq(1).trigger("click");
            });

        });




        var zNodes = jQuery.parseJSON($('#menu_tree').val());
        function addDiyDom(treeId, treeNode) {
            var spanObj = $("#" + treeNode.tId + '_span');
            spanObj.parent().attr("href", "/m/menu/MenuNodeDetatil/" + treeNode.id);
            spanObj.parent().attr("target", null);
            if (treeNode.pId == null) {
                spanObj.addClass("tree_ico");
                spanObj.empty();
                spanObj.after(treeNode.name);
            } else {
                spanObj.parent().parent().parent().css("display", "none");
                spanObj.after(treeNode.name);
                spanObj.remove();
            }

            if (treeNode.checked == true) {
                var liObj = $("#" + treeNode.tId);
                var $liObj = liObj;
                $liObj.addClass("current");
            }
        }





        var ztree = jQuery.fn.zTree.init($("#menuTree"), {
            view: {
                showLine: false,
                showIcon: false,
                selectedMulti: false,
                dblClickExpand: false,
                addDiyDom: addDiyDom

            },
            data: { simpleData: { enable: true } },
            callback: {
                onClick: function (event, treeId, treeNode) {
                    ajaxShowPath(treeNode.id);
                }
            }
        }, zNodes);
        $('span.button').remove();

        $('#menuTree a').live("click", function (e) {
            var $this = $(this);
            $("#menuTree").find("li").removeClass("current");
            $this.parent().addClass("current");
            e.preventDefault();
            if ($this.attr("href") != undefined) {
                ajaxLoad($this);
            }
        });



        $('#menuTree a').first().trigger("click");


    })
</script>
